<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>列表标记</title>
</head>
<body>
    <!-- 应用场景 - 适合做导航 -->
    <!-- 无序列表
         type属性 - square circle disc
    -->
    <ur type="circle">第二阶段
        <li>mysql</li>
        <li>jdbc</li>
        <li>mybatis</li>
    </ur>

    <!-- 有序列表 -->
    <ol type="i">第三阶段
        <li>html标签</li>
        <li>css样式</li>
        <li>JavaScript</li>
    </ol>

    <!-- 支持嵌套使用 -->
    <ul>
        <li>第二阶段
            <ol>
                <li>mysql</li>
                <li>jdbc</li>
                <li>mybatis</li>
            </ol>
        </li>
        <li>第三阶段
            <ol>
                <li>html标签</li>
                <li>css样式</li>
                <li>JavaScript</li>
            </ol>
        </li>
    </ul>

    <hr>
    <!-- html5.0中支持自定义列表标签 -->
    <dl>
        <dt>一一一一</dt>
        <dd>二二二二</dd>
        <dd>三三三三</dd>

        <dt>四四四四</dt>
        <dd>五五五五</dd>
        <dd>六六六六</dd>
    </dl>



</body>
</html>